<!DOCTYPE html>
<!--[if lt IE 7 ]> <html class="ie6"> <![endif]-->
<!--[if IE 7 ]>    <html class="ie7"> <![endif]-->
<!--[if IE 8 ]>    <html class="ie8"> <![endif]-->
<!--[if IE 9 ]>    <html class="ie9"> <![endif]-->
<!--[if (gt IE 9)|!(IE)]><!-->
<html>
<!--<![endif]-->

<head>
<meta charset="utf-8">
<title>Boo Admin - Widget Style</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=0, minimum-scale=1.0, maximum-scale=1.0">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black">
<meta name="description" content="">
<meta name="author" content="">

<!-- Le styles -->
<link href="assets/css/lib/bootstrap.css" rel="stylesheet">
<link href="assets/css/lib/bootstrap-responsive.css" rel="stylesheet">
<link href="assets/css/extension.css" rel="stylesheet">
<link href="assets/css/boo.css" rel="stylesheet">
<link href="assets/css/style.css" rel="stylesheet">
<link href="assets/css/boo-coloring.css" rel="stylesheet">
<link href="assets/css/boo-utility.css" rel="stylesheet">

<!-- Le HTML5 shim, for IE6-8 support of HTML5 elements -->
<!--[if lt IE 9]>
	<script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
    <script src="assets/plugins/selectivizr/selectivizr-min.js"></script>
    <script src="assets/plugins/flot/excanvas.min.js"></script>
<![endif]-->

<!-- Le fav and touch icons -->
<link rel="shortcut icon" href="assets/ico/favicon.ico">
<link rel="apple-touch-icon-precomposed" sizes="144x144" href="assets/ico/apple-touch-icon-144-precomposed.html">
<link rel="apple-touch-icon-precomposed" sizes="114x114" href="assets/ico/apple-touch-icon-114-precomposed.html">
<link rel="apple-touch-icon-precomposed" sizes="72x72" href="assets/ico/apple-touch-icon-72-precomposed.html">
<link rel="apple-touch-icon-precomposed" href="assets/ico/apple-touch-icon-57-precomposed.html">
</head>

<body class="sidebar-left panel-side">
<div class="page-container">
    <div id="header-container">
        <div id="header">
            <div class="navbar navbar-inverse navbar-fixed-top">
                <div class="navbar-inner">
                    <div class="container-fluid">
                        <button type="button" class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse"> <span class="icon-bar"></span> <span class="icon-bar"></span> <span class="icon-bar"></span> </button>
                        <a class="brand" href="javascript:void(0);"><img src="assets/img/demo/logo-brand.png"></a>
                        <div class="search-global">
                            <input id="globalSearch" class="search search-query input-medium" type="search">
                            <a class="search-button" href="javascript:void(0);"><i class="fontello-icon-search-5"></i></a> </div>
                        <div class="nav-collapse collapse">
                            <ul class="nav user-menu visible-desktop">
                                <li><a class="btn-glyph fontello-icon-edit tip-bc" href="javascript:void(0);" title="Messages"><span class="badge badge-important">8</span></a></li>
                                <li><a class="btn-glyph fontello-icon-mail-1 tip-bc" href="javascript:void(0);" title="Emails"></a></li>
                                <li><a class="btn-glyph fontello-icon-lifebuoy tip-bc" href="javascript:void(0);" title="Support"><span class="badge badge-important">4</span></a></li>
                            </ul>
                            <ul class="nav">
                                <li> <a href="dashboard-one.html">Dashboard</a> </li>
                                <li class="active"> <a href="javascript:void(0);">Components</a> </li>
                                <li> <a href="component-fullcalendar-demo.html"><span class="fontello-icon-calendar"></span>Calendar</a> </li>
                                <li> <a href="javascript:void(0);"><span class="fontello-icon-users"></span>Contacts</a> </li>
                                <li class="dropdown"> <a href="javascript:void(0);" class="dropdown-toggle" data-toggle="dropdown"><span class="fontello-icon-list-1"></span>Customize <b class="caret"></b></a>
                                    <ul class="dropdown-menu">
                                        <li><a href="component-form-demo.html">Demo Form</a></li>
                                        <li><a href="component-widgets-remember.html">Remember</a></li>
                                        <li><a href="component-widgets-users.html">User List</a></li>
                                        <li class="divider"></li>
                                        <li class="nav-header">Next Update</li>
                                        <li><a href="javascript:void(0);">Contacts</a></li>
                                        <li><a href="javascript:void(0);">Email</a></li>
                                    </ul>
                                </li>
                            </ul>
                        </div>
                    </div>
                </div>
            </div>
            <!-- // navbar -->
            
            <div class="header-drawer">
                <div class="mobile-nav text-center visible-phone"> <a href="javascript:void(0);" class="mobile-btn" data-toggle="collapse" data-target=".sidebar"><i class="aweso-icon-chevron-down"></i> Components</a> </div>
                <!-- // Resposive navigation -->
                <div class="breadcrumbs-nav hidden-phone">
                    <ul id="breadcrumbs" class="breadcrumb">
                        <li><a href="javascript:void(0);"><i class="fontello-icon-home f12"></i> Dashboard</a> <span class="divider">/</span></li>
                        <li class="dropdown"><a href="javascript:void(0);">Table </a> <span class="divider">/</span>
                            <ul class="dropdown-menu">
                                <li><a href="javascript:void(0);">Table</a></li>
                                <li><a href="javascript:void(0);">Elements</a></li>
                                <li><a href="javascript:void(0);">Elements</a></li>
                                <li><a href="javascript:void(0);">Elements</a></li>
                            </ul>
                        </li>
                        <li class="active">Boo Admin </li>
                    </ul>
                </div>
                <!-- // breadcrumbs --> 
            </div>
            <!-- // drawer --> 
        </div>
    </div>
    <!-- // header-container -->
    
    <div id="main-container">
        <div id="main-sidebar" class="sidebar sidebar-inverse">
            <div class="sidebar-item">
                <div class="media profile">
                    <div class="media-thumb media-left thumb-bordereb"> <a class="img-shadow" href="javascript:void(0);"><img class="thumb" src="assets/img/demo/demo-avatar9604.jpg"></a> </div>
                    <div class="media-body">
                        <h5 class="media-heading">Twitter Bootstrap <small>as Administrator</small></h5>
                        <p class="data">Last Access: 16 May 15:30</p>
                    </div>
                </div>
            </div>
            <!-- // sidebar item - profile -->
            
            <ul id="mainSideMenu" class="nav nav-list nav-side">
                <li class="accordion-group">
                    <div class="accordion-heading"> <a href="#accDash" data-parent="#mainSideMenu" data-toggle="collapse" class="accordion-toggle"> <span class="item-icon fontello-icon-monitor"></span> <i class="chevron fontello-icon-right-open-3"></i> Dashboards </a> </div>
                    <ul class="accordion-content nav nav-list collapse" id="accDash">
                        <li> <a href="dashboard-one.html"> <i class="fontello-icon-right-dir"></i> <span class="hidden-tablet">Dashboard</span> Demo 1 </a> </li>
                        <li> <a href="dashboard-two.html"> <i class="fontello-icon-right-dir"></i> <span class="hidden-tablet">Dashboard</span> Demo 2 </a> </li>
                    </ul>
                </li>
                <!-- // item accordionMenu Dashboard -->
                <li class="accordion-group">
                    <div class="accordion-heading"> <a href="#accForms" data-parent="#mainSideMenu" data-toggle="collapse" class="accordion-toggle"> <span class="item-icon aweso-icon-list-alt"></span><i class="chevron fontello-icon-right-open-3"></i> Form </a> </div>
                    <ul class="accordion-content nav nav-list collapse" id="accForms">
                        <li> <a href="component-form-demo.html"> <i class="fontello-icon-right-dir"></i> Demo Form </a> </li>
                        <li> <a href="component-form-element.html"> <i class="fontello-icon-right-dir"></i> Form Element </a> </li>
                        <li> <a href="component-form-extension.html"> <i class="fontello-icon-right-dir"></i> Form Extension</a> </li>
                        <li> <a href="component-form-wizard.html"> <i class="fontello-icon-right-dir"></i> Form Wizard</a> </li>
                    </ul>
                </li>
                <!-- // item accordionMenu Forms -->
                <li class="accordion-group">
                    <div class="accordion-heading"> <a href="#accTables" data-parent="#mainSideMenu" data-toggle="collapse" class="accordion-toggle"> <span class="item-icon fontello-icon-align-justify"></span> <i class="chevron fontello-icon-right-open-3"></i> Tables </a> </div>
                    <ul class="accordion-content nav nav-list collapse" id="accTables">
                        <li> <a href="component-table.html"> <i class="fontello-icon-right-dir"></i> Base Table </a> </li>
                        <li> <a href="component-table-boo.html"> <i class="fontello-icon-right-dir"></i> Boo Table </a> </li>
                        <li> <a href="component-table-datatable.html"> <i class="fontello-icon-right-dir"></i> DataTable </a> </li>
                    </ul>
                </li>
                <!-- // item accordionMenu Tables -->
                <li class="accordion-group">
                    <div class="accordion-heading"> <a href="#accStatistics" data-parent="#mainSideMenu" data-toggle="collapse" class="accordion-toggle"> <span class="item-icon fontello-icon-chart"></span> <i class="chevron fontello-icon-right-open-3"></i> Statistics </a> </div>
                    <ul class="accordion-content nav nav-list collapse" id="accStatistics">
                        <li> <a href="statistic-flot.html"> <i class="fontello-icon-right-dir"></i> Charts </a> </li>
                        <li> <a href="statistic-sparkline.html"> <i class="fontello-icon-right-dir"></i> Sparklines </a> </li>
                    </ul>
                </li>
                <!-- // item accordionMenu Statistics -->
                <li class="accordion-group">
                    <div class="accordion-heading active"> <a href="#accWidgets" data-parent="#mainSideMenu" data-toggle="collapse" class="accordion-toggle"> <span class="item-icon  fontello-icon-window"></span> <i class="chevron fontello-icon-right-open-3"></i> Widgets </a> </div>
                    <ul class="accordion-content nav nav-list collapse in" id="accWidgets">
                        <li class="active"> <a href="component-widget-style.html"> <i class="fontello-icon-right-dir"></i> <span class="hidden-tablet">Widgets </span> Style </a> </li>
                        <li> <a href="component-widget-custom.html"> <i class="fontello-icon-right-dir"></i> <span class="hidden-tablet">Widgets </span> Custom </a> </li>
                    </ul>
                </li>
                <!-- // item accordionMenu Widgets -->
                <li class="accordion-group">
                    <div class="accordion-heading"> <a href="#accButtons" data-parent="#mainSideMenu" data-toggle="collapse" class="accordion-toggle"> <span class="item-icon fontello-icon-puzzle"></span> <i class="chevron fontello-icon-right-open-3"></i> UI Elements </a> </div>
                    <ul class="accordion-content nav nav-list collapse" id="accButtons">
                        <li> <a href="elements-button.html"> <i class="fontello-icon-right-dir"></i> Button </a> </li>
                        <li> <a href="elements-icon-font.html"> <i class="fontello-icon-right-dir"></i> Iconic fonts </a> </li>
                        <li> <a href="elements-icon-fugue-demo.html"> <i class="fontello-icon-right-dir"></i> Icon </a> </li>
                        <li> <a href="elements-wells.html"> <i class="fontello-icon-right-dir"></i> Wells </a> </li>
                        <li> <a href="elements-tabs.html"> <i class="fontello-icon-right-dir"></i> Tabs </a> </li>
                        <li> <a href="elements-modals.html"> <i class="fontello-icon-right-dir"></i> Modal </a> </li>
                        <li> <a href="elements-progressbar.html"> <i class="fontello-icon-right-dir"></i> Progressbar </a> </li>
                    </ul>
                </li>
                <!-- // item accordionMenu UI Elements -->
                <li class="accordion-group">
                    <div class="accordion-heading"> <a href="#accCalendar" data-parent="#mainSideMenu" data-toggle="collapse" class="accordion-toggle"> <span class="item-icon fontello-icon-calendar"></span> <i class="chevron fontello-icon-right-open-3"></i> Calendar </a> </div>
                    <ul class="accordion-content nav nav-list collapse" id="accCalendar">
                        <li> <a href="component-fullcalendar-demo.html"> <i class="fontello-icon-right-dir"></i> <span class="hidden-tablet">Calendar </span> Demo </a> </li>
                        <li> <a href="component-fullcalendar.html"> <i class="fontello-icon-right-dir"></i> <span class="hidden-tablet">Calendar </span> Style </a> </li>
                    </ul>
                </li>
                <!-- // item accordionMenu Calendar -->
            </ul>
            <!-- // sidebar menu -->
            
            <div class="sidebar-item"></div>
            <!-- // sidebar item --> 
            
        </div>
        <!-- // sidebar -->
        
        <div id="main-content" class="main-content container-fluid">
            <div class="row-fluid page-head">
                <h2 class="page-title"><i class="fontello-icon-window"></i> Widget <small>style & construction</small></h2>
                <!--<p class="pagedesc">jQuery DataTable + Bootstrap + Boo = a powerful combination to display your data </p> -->
                <div class="page-bar">
                    <div class="btn-toolbar"> </div>
                </div>
            </div>
            <!-- // page head -->
            
            <div id="page-content" class="page-content">
                <nav>
                    <ul class="btn-toolbar page-nav margin-btn">
                        <li><a class="btn btn-well btn-glyph" href="component-widgets-remember.html" style="width:80px"><i class="fontello-icon-check f30"></i><span class="block">REMEMBER</span></a></li>
                        <li><a class="btn btn-well btn-glyph" href="component-widgets-users.html" style="width:80px"><i class="fontello-icon-user f30"></i><span class="block">USER</span></a></li>
                        <li><a class="btn btn-well btn-glyph" href="component-widgets-post.html" style="width:80px"><i class="fontello-icon-feather f30"></i><span class="block">POST</span></a></li>
                        <li><a class="btn btn-well btn-glyph" href="#updateModal" style="width:80px" data-toggle="modal"><i class="fontello-icon-vcard f30"></i><span class="block">CONTACTS</span></a></li>
                        <li><a class="btn btn-well btn-glyph" href="#updateModal" style="width:80px" data-toggle="modal"><i class="fontello-icon-edit f30"></i><span class="block">ARTICLE</span></a></li>
                        <li><a class="btn btn-well btn-glyph" href="#updateModal" style="width:80px" data-toggle="modal"><i class="fontello-icon-comment-4 f30"></i><span class="block">COMMENTS</span></a></li>
                        <li><a class="btn btn-well btn-glyph" href="#updateModal" style="width:80px" data-toggle="modal"><i class="fontello-icon-back-in-time f30"></i><span class="block">ACTIVITY</span></a></li>
                        <li><a class="btn btn-well btn-glyph" href="#updateModal" style="width:80px" data-toggle="modal"><i class="fontello-icon-arrows-cw f30"></i><span class="block">LAST UPDATE</span></a></li>
                    </ul>
                    <hr class="margin-0x">
                </nav>
                <section>
                    <div class="page-header">
                        <h3>Widget <small>three basic blocks</small></h3>
                    </div>
                    <div class="row-fluid">
                        <div class="span4">
                            <p>To build a widget use 3 basic blocks.</p>
                            <p>
                            <pre class="prettyprint linenums">
&lt;!-- widget base --&gt;
&lt;div class="widget"&gt;
  &lt;div class="widget-header"&gt; ... &lt;/div&gt;
  &lt;div class="widget-content"&gt; ... &lt;/div&gt;
  &lt;div class="widget-footer"&gt; ... &lt;/div&gt;
&lt;/div&gt;
</pre>
                            </p>
                        </div>
                        <!-- // column -->
                        
                        <div class="span8">
                            <div class="widget">
                                <div class="widget-header">
                                    <h4> Widget <small>header</small></h4>
                                </div>
                                <div class="widget-content">
                                    <div class="widget-body">
                                        <h4>widget content <small>anything</small></h4>
                                        <p>Lorem ipsum dolor sit amet consectetuer pede tempor ligula sem tempus. A nascetur gravida parturient est Aenean facilisis In est consectetuer Nam. Adipiscing odio tincidunt ac ornare pellentesque metus diam laoreet sollicitudin vel. Libero libero condimentum neque accumsan dapibus dignissim leo Nam enim ac. Ac massa tellus cursus Aliquam mi vel eu vel adipiscing mauris. </p>
                                    </div>
                                </div>
                                <div class="widget-footer">
                                    <h4> Widget <small>footer</small></h4>
                                </div>
                            </div>
                            <!-- // Widget --> 
                        </div>
                        <!-- // column --> 
                        
                    </div>
                    <!-- // Example row --> 
                </section>
                <section>
                    <div class="page-header">
                        <h3>... three blocks, three styles </h3>
                    </div>
                    <div class="row-fluid">
                        <div class="span4">
                            <div class="widget">
                                <div class="widget-header">
                                    <h4><i class="fontello-icon-window"></i> Widget base</h4>
                                </div>
                                <div class="widget-content">
                                    <div class="widget-body">
                                        <p class="lead">Lightweight widget - Basic Settings.</p>
                                        <p>use class <code>.widget</code></p>
                                        <p>Lorem ipsum dolor sit amet consectetuer pede tempor ligula sem tempus. A nascetur gravida parturient est Aenean facilisis In est consectetuer Nam. Adipiscing odio tincidunt ac ornare pellentesque metus diam laoreet sollicitudin vel. </p>
                                    </div>
                                </div>
                                <div class="widget-footer">
                                    <div class="btn-toolbar"> <a class="btn" href="javascript:void(0);">View details &raquo;</a> </div>
                                </div>
                            </div>
                            <!-- // Widget -->
                            
                            <div class="widget">
                                <div class="widget-header">
                                    <h4><i class="fontello-icon-window"></i> Widget Simple <small>no footer</small></h4>
                                </div>
                                <div class="widget-content">
                                    <div class="widget-body">
                                        <p>Lorem ipsum dolor sit amet consectetuer pede tempor ligula sem tempus. A nascetur gravida parturient est Aenean facilisis In est consectetuer Nam.</p>
                                    </div>
                                </div>
                            </div>
                            <!-- // Widget -->
                            
                            <div class="widget">
                                <div class="widget-header no-border">
                                    <h4><i class="fontello-icon-window"></i></h4>
                                    <div class="widget-tool">
                                        <div class="btn-toolbar">
                                            <div class="btn-group">
                                                <button class="btn btn-green btn-small">day</button>
                                                <button class="btn btn-green btn-small">month</button>
                                                <button class="btn btn-green btn-small">year</button>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <div class="widget-title">
                                    <h6>Here Widget Title <small>use only h6</small></h6>
                                </div>
                                <div class="widget-content">
                                    <div class="widget-body">
                                        <p>Lorem ipsum dolor sit amet consectetuer pede tempor ligula sem tempus. A nascetur gravida parturient est Aenean facilisis In est consectetuer Nam.Lorem ipsum dolor sit amet consectetuer pede tempor ligula sem tempus. A nascetur </p>
                                    </div>
                                </div>
                            </div>
                            <!-- // Widget -->
                            
                            <div class="widget">
                                <div class="widget-header">
                                    <h4><i class="fontello-icon-window"></i>With Bar</h4>
                                    <div class="widget-tool">
                                        <div class="btn-toolbar">
                                            <button class="btn btn-green btn-small">save</button>
                                        </div>
                                    </div>
                                </div>
                                <div class="widget-bar">
                                    <div class="btn-toolbar"> <a class="btn btn-glyph btn-small" href="#"><i class="fugue-blue-document-pencil"></i></a> <a class="btn btn-glyph btn-small" href="#"><i class="fugue-blue-document-plus"></i></a> <a class="btn btn-glyph btn-small" href="#"><i class="fugue-blue-document-minus"></i></a>
                                        <div class="btn-group pull-right">
                                            <button class="btn btn-small">day</button>
                                            <button class="btn btn-small">month</button>
                                            <button class="btn btn-small">year</button>
                                        </div>
                                    </div>
                                </div>
                                <div class="widget-content">
                                    <div class="widget-body">
                                        <p>Use block <code>.widget-bar</code> Lorem ipsum dolor sit amet consectetuer pede tempor ligula sem tempus. A nascetur gravida parturient est Aenean facilisis In est consectetuer Nam.</p>
                                    </div>
                                </div>
                            </div>
                            <!-- // Widget --> 
                            
                        </div>
                        <!-- // Column -->
                        
                        <div class="span4">
                            <div class="widget widget-simple">
                                <div class="widget-header">
                                    <h4><i class="fontello-icon-window"></i> Widget Simple</h4>
                                </div>
                                <div class="widget-content">
                                    <div class="widget-body">
                                        <p class="margin-0x"><span class="lead">Simple widget - Style Well</span> but with more capabilities than Well.</p>
                                        <p>combine class <code>.widget .widget-simple</code></p>
                                        <p>Lorem ipsum dolor sit amet consectetuer pede tempor ligula sem tempus. A nascetur gravida parturient est Aenean facilisis In est consectetuer Nam. Adipiscing odio tincidunt ac ornare pellentesque metus diam laoreet sollicitudin vel. </p>
                                    </div>
                                    <div class="widget-footer">
                                        <div class="btn-toolbar"> <a class="btn" href="#">View details &raquo;</a> </div>
                                    </div>
                                </div>
                            </div>
                            <!-- // Widget -->
                            
                            <div class="widget widget-simple">
                                <div class="widget-header">
                                    <h4><i class="fontello-icon-window"></i> Widget Simple <small>no footer</small></h4>
                                </div>
                                <div class="widget-content">
                                    <div class="widget-body">
                                        <p>Lorem ipsum dolor sit amet consectetuer pede tempor ligula sem tempus. A nascetur gravida parturient est Aenean facilisis In est consectetuer Nam.</p>
                                    </div>
                                </div>
                            </div>
                            <!-- // Widget -->
                            
                            <div class="widget widget-simple">
                                <div class="widget-header no-border">
                                    <h4><i class="fontello-icon-window"></i></h4>
                                    <div class="widget-tool">
                                        <div class="btn-toolbar">
                                            <div class="btn-group">
                                                <button class="btn btn-green btn-small">day</button>
                                                <button class="btn btn-green btn-small">month</button>
                                                <button class="btn btn-green btn-small">year</button>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <div class="widget-title">
                                    <h6>Here Widget Title <small>use only h6</small></h6>
                                </div>
                                <div class="widget-content">
                                    <div class="widget-body">
                                        <p>Use block <code>.widget-title</code><br>
                                            Lorem ipsum dolor sit amet consectetuer pede tempor ligula sem tempus. A nascetur gravida parturient est Aenean facilisis In est consectetuer Nam.</p>
                                    </div>
                                </div>
                            </div>
                            <!-- // Widget -->
                            
                            <div class="widget widget-simple">
                                <div class="widget-header">
                                    <h4><i class="fontello-icon-window"></i>With Bar</h4>
                                    <div class="widget-tool">
                                        <div class="btn-toolbar">
                                            <button class="btn btn-green btn-small">save</button>
                                        </div>
                                    </div>
                                </div>
                                <div class="widget-bar">
                                    <div class="btn-toolbar"> <a class="btn btn-glyph btn-small" href="#"><i class="fugue-blue-document-pencil"></i></a> <a class="btn btn-glyph btn-small" href="#"><i class="fugue-blue-document-plus"></i></a> <a class="btn btn-glyph btn-small" href="#"><i class="fugue-blue-document-minus"></i></a>
                                        <div class="btn-group pull-right">
                                            <button class="btn btn-small">day</button>
                                            <button class="btn btn-small">month</button>
                                            <button class="btn btn-small">year</button>
                                        </div>
                                    </div>
                                </div>
                                <div class="widget-content">
                                    <div class="widget-body">
                                        <p>Use block <code>.widget-bar</code> Lorem ipsum dolor sit amet consectetuer pede tempor ligula sem tempus. A nascetur gravida parturient est Aenean facilisis In est consectetuer Nam.</p>
                                    </div>
                                </div>
                            </div>
                            <!-- // Widget --> 
                            
                        </div>
                        <!-- // Column -->
                        
                        <div class="span4">
                            <div class="widget widget-box">
                                <div class="widget-header">
                                    <h4><i class="fontello-icon-window"></i> Widget Box</h4>
                                </div>
                                <div class="widget-content">
                                    <div class="widget-body">
                                        <p class="lead">As the box - Widget-Box...</p>
                                        <p>combine class <code>.widget .widget-box</code></p>
                                        <p>Lorem ipsum dolor sit amet consectetuer pede tempor ligula sem tempus. A nascetur gravida parturient est Aenean facilisis In est consectetuer Nam. Adipiscing odio tincidunt ac ornare pellentesque metus diam laoreet sollicitudin vel. </p>
                                    </div>
                                </div>
                                <div class="widget-footer">
                                    <div class="btn-toolbar"> <a class="btn" href="javascript:void(0);">View details &raquo;</a> </div>
                                </div>
                            </div>
                            <!-- // Widget -->
                            
                            <div class="widget widget-box">
                                <div class="widget-header">
                                    <h4><i class="fontello-icon-window"></i> Widget Box <small>no footer</small></h4>
                                </div>
                                <div class="widget-content">
                                    <div class="widget-body">
                                        <p>Lorem ipsum dolor sit amet consectetuer pede tempor ligula sem tempus. A nascetur gravida parturient est Aenean facilisis In est consectetuer Nam. </p>
                                    </div>
                                </div>
                            </div>
                            <!-- // Widget -->
                            
                            <div class="widget widget-box">
                                <div class="widget-header no-border">
                                    <h4><i class="fontello-icon-window"></i></h4>
                                    <div class="widget-tool">
                                        <div class="btn-toolbar">
                                            <div class="btn-group">
                                                <button class="btn btn-green btn-small">day</button>
                                                <button class="btn btn-green btn-small">month</button>
                                                <button class="btn btn-green btn-small">year</button>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <div class="widget-title">
                                    <h6>Here Widget Title <small>use only h6</small></h6>
                                </div>
                                <div class="widget-content">
                                    <div class="widget-body">
                                        <p>Use block <code>.widget-title</code><br>
                                            Lorem ipsum dolor sit amet consectetuer pede tempor ligula sem tempus. A nascetur gravida parturient est Aenean facilisis In est consectetuer Nam.</p>
                                    </div>
                                </div>
                            </div>
                            <!-- // Widget -->
                            
                            <div class="widget widget-box">
                                <div class="widget-header no-border">
                                    <h4><i class="fontello-icon-window"></i>With Bar</h4>
                                    <div class="widget-tool">
                                        <div class="btn-toolbar">
                                            <button class="btn btn-green btn-small">save</button>
                                        </div>
                                    </div>
                                </div>
                                <div class="widget-title">
                                    <h6>Here Widget Title <small>use only h6</small></h6>
                                </div>
                                <div class="widget-bar">
                                    <div class="btn-toolbar"> <a class="btn btn-glyph btn-small" href="#"><i class="fugue-blue-document-pencil"></i></a> <a class="btn btn-glyph btn-small" href="#"><i class="fugue-blue-document-plus"></i></a> <a class="btn btn-glyph btn-small" href="#"><i class="fugue-blue-document-minus"></i></a>
                                        <div class="btn-group pull-right">
                                            <button class="btn btn-small">day</button>
                                            <button class="btn btn-small">month</button>
                                            <button class="btn btn-small">year</button>
                                        </div>
                                    </div>
                                </div>
                                <div class="widget-content">
                                    <div class="widget-body">
                                        <p>Use block <code>.widget-bar</code> or combine with <code>.widget-title</code><br>
                                            Lorem ipsum dolor sit amet consectetuer pede tempor </p>
                                    </div>
                                </div>
                            </div>
                            <!-- // Widget --> 
                            
                        </div>
                        <!-- // Column --> 
                        
                    </div>
                    <!-- // Example row --> 
                </section>
                <section>
                    <div class="page-header">
                        <h3>Collapsible & Clickable </h3>
                    </div>
                    <div class="row-fluid">
                        <div class="span4">
                            <div class="widget widget-collapsible">
                                <div class="widget-header">
                                    <h4><i class="fontello-icon-window"></i> Colapsible <small>click button</small></h4>
                                    <div class="widget-tool"><a class="btn btn-glyph btn-yellow widget-toggle fontello-icon-publish" data-toggle="collapse" data-target="#demo" href="javascript:void(0);"></a></div>
                                </div>
                                <div id="demo" class="widget-content collapse in">
                                    <div class="widget-body">
                                        <h4>Widget collapse - click button</h4>
                                        <p>Donec id elit non mi porta gravida at eget metus. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus.</p>
                                    </div>
                                    <div class="widget-footer box-shadow-in">
                                        <div class="btn-toolbar padding-side"> <a class="btn btn-green" href="javascript:void(0);">View details &raquo;</a> </div>
                                    </div>
                                </div>
                            </div>
                            <!-- // Widget --> 
                            
                        </div>
                        <!-- // Column -->
                        
                        <div class="span4">
                            <div class="widget widget-simple widget-collapsible">
                                <div class="widget-header">
                                    <h4><i class="fontello-icon-window"></i> Colapsible <small>click icon</small></h4>
                                    <div class="widget-tool"><a class="btn btn-glyph btn-link widget-toggle fontello-icon-publish"  data-toggle="collapse" data-target="#demo1" href="javascript:void(0);"></a></div>
                                </div>
                                <div id="demo1" class="widget-content collapse in">
                                    <div class="widget-body">
                                        <h4>Widget collapse - click icon</h4>
                                        <p>Donec id elit non mi porta gravida at eget metus. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus.</p>
                                    </div>
                                    <div class="widget-footer">
                                        <div class="btn-toolbar padding-side"> <a class="btn btn-green" href="javascript:void(0);">View details &raquo;</a> </div>
                                    </div>
                                </div>
                            </div>
                            <!-- // Widget --> 
                            
                        </div>
                        <!-- // Column -->
                        
                        <div class="span4">
                            <div class="widget widget-box widget-collapsible">
                                <div class="widget-header clickable" data-toggle="collapse" data-target="#demo2">
                                    <h4><i class="fontello-icon-window"></i> Colapsible <small>clickable header</small></h4>
                                    <div class="widget-tool"><span class="btn btn-glyph btn-link widget-toggle fontello-icon-publish"></span></div>
                                </div>
                                <div id="demo2" class="widget-content collapse in">
                                    <div class="widget-body">
                                        <h4>Widget collapse - click header</h4>
                                        <p>Donec id elit non mi porta gravida at eget metus. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus.</p>
                                    </div>
                                    <div class="widget-footer box-shadow-in">
                                        <div class="btn-toolbar"> <a class="btn btn-green" href="javascript:void(0);">View details &raquo;</a> </div>
                                    </div>
                                </div>
                            </div>
                            <!-- // Widget --> 
                            
                        </div>
                        <!-- // Column --> 
                        
                    </div>
                    <!-- // Example row --> 
                </section>
                <section>
                    <div class="page-header">
                        <h3>Widget-header size</h3>
                    </div>
                    <div class="row-fluid">
                        <div class="span4">
                            <div class="widget">
                                <div class="widget-header">
                                    <h3><i class="fontello-icon-window"></i> Header H3</h3>
                                </div>
                                <p>Donec id elit non mi porta gravida at eget metus.</p>
                                <div class="widget-header">
                                    <h4><i class="fontello-icon-window"></i> Header H4</h4>
                                </div>
                                <p>Donec id elit non mi porta gravida at eget metus.</p>
                                <div class="widget-header header-small">
                                    <h5><i class="fontello-icon-window"></i> Header H5</h5>
                                </div>
                                <p>Donec id elit non mi porta gravida at eget metus.</p>
                                <div class="widget-header header-small">
                                    <h6><i class="fontello-icon-window"></i> Header H6</h6>
                                </div>
                                <p>Donec id elit non mi porta gravida at eget metus.</p>
                            </div>
                        </div>
                        <!-- // Column -->
                        
                        <div class="span4">
                            <div class="widget widget-simple widget-collapsible">
                                <div class="widget-header header-small clickable collapsed" data-toggle="collapse" data-target="#demoG">
                                    <h3><i class="fontello-icon-window"></i> Header Size H3 </h3>
                                    <div class="widget-tool"><span class="btn btn-glyph btn-link widget-toggle-btn fontello-icon-publish"></span></div>
                                </div>
                                <div id="demoG" class="widget-content collapse">
                                    <div class="widget-body">
                                        <p>Donec id elit non mi porta</p>
                                    </div>
                                    <div class="widget-footer">
                                        <div class="btn-toolbar"> <a class="btn btn-green" href="javascript:void(0);">View details &raquo;</a> </div>
                                    </div>
                                </div>
                            </div>
                            <!-- // Widget -->
                            
                            <div class="widget widget-simple widget-collapsible">
                                <div class="widget-header header-small clickable collapsed" data-toggle="collapse" data-target="#demoE">
                                    <h6><i class="fontello-icon-window"></i> Header Size H6 </h6>
                                    <div class="widget-tool"><span class="btn btn-mini btn-glyph btn-link widget-toggle-btn fontello-icon-publish"></span></div>
                                </div>
                                <div id="demoE" class="widget-content collapse">
                                    <div class="widget-body">
                                        <p>Donec id elit non mi porta</p>
                                    </div>
                                    <div class="widget-footer">
                                        <div class="btn-toolbar"> <a class="btn btn-green" href="javascript:void(0);">View details &raquo;</a> </div>
                                    </div>
                                </div>
                            </div>
                            <!-- // Widget --> 
                            
                        </div>
                        <!-- // Column -->
                        
                        <div class="span4">
                            <div class="widget widget-box widget-collapsible">
                                <div class="widget-header header-small clickable collapsed" data-toggle="collapse" data-target="#demoH">
                                    <h3><i class="fontello-icon-window"></i> Header Size H3 </h3>
                                    <div class="widget-tool"><span class="btn btn-glyph btn-link widget-toggle-btn fontello-icon-publish"></span></div>
                                </div>
                                <div id="demoH" class="widget-content collapse">
                                    <div class="widget-body">
                                        <p>Donec id elit non mi porta</p>
                                    </div>
                                    <div class="widget-footer">
                                        <div class="btn-toolbar"> <a class="btn btn-green" href="javascript:void(0);">View details &raquo;</a> </div>
                                    </div>
                                </div>
                            </div>
                            <!-- // Widget -->
                            
                            <div class="widget widget-box widget-collapsible">
                                <div class="widget-header header-small clickable collapsed" data-toggle="collapse" data-target="#demoF">
                                    <h6><i class="fontello-icon-window"></i> Header Size H6 </h6>
                                    <div class="widget-tool"><span class="btn btn-mini btn-glyph btn-link widget-toggle-btn fontello-icon-publish"></span></div>
                                </div>
                                <div id="demoF" class="widget-content collapse">
                                    <div class="widget-body">
                                        <p>Donec id elit non mi porta</p>
                                    </div>
                                    <div class="widget-footer">
                                        <div class="btn-toolbar"> <a class="btn btn-green" href="javascript:void(0);">View details &raquo;</a> </div>
                                    </div>
                                </div>
                            </div>
                            <!-- // Widget --> 
                            
                        </div>
                        <!-- // Column --> 
                        
                    </div>
                    <!-- // Example row --> 
                    
                </section>
                <section>
                    <div class="page-header">
                        <h3>Widget Content</h3>
                    </div>
                    <div class="row-fluid">
                        <div class="span4">
                            <div class="widget widget-collapsible">
                                <div class="widget-header header-small clickable" data-toggle="collapse" data-target="#demoA">
                                    <h4><i class="fontello-icon-window"></i> widge-row </h4>
                                    <div class="widget-tool"><span class="btn btn-glyph btn-link widget-toggle-btn fontello-icon-publish"></span></div>
                                </div>
                                <div id="demoA" class="widget-content collapse in">
                                    <div class="widget-body">
                                        <div class="widget-row">
                                            <p><code>&lt;div class="widget-row"&gt; ... &lt;/div&gt;</code> Donec id elit non mi porta</p>
                                        </div>
                                        <div class="widget-row">
                                            <p><code>&lt;div class="widget-row"&gt; ... &lt;/div&gt;</code> Donec id elit non mi porta</p>
                                        </div>
                                    </div>
                                    <div class="widget-footer">
                                        <div class="btn-toolbar"> <a class="btn" href="javascript:void(0);">View details &raquo;</a> </div>
                                    </div>
                                </div>
                            </div>
                            <!-- // Widget -->
                            
                            <div class="widget">
                                <div class="widget-header">
                                    <h4><i class="fontello-icon-window"></i> widget-list</h4>
                                    <div class="btn-toolbar pull-right"> <a class="btn btn-green" href="javascript:void(0);">New</a> </div>
                                </div>
                                <div class="widget-content">
                                    <div class="widget-body">
                                        <ul class="widget-list">
                                            <li role="row">
                                                <p><code>&lt;li&gt; ... &lt;/li&gt;</code> Donec id elit non mi porta gravida</p>
                                            </li>
                                            <li role="row">
                                                <p><code>&lt;li&gt; ... &lt;/li&gt;</code> Donec id elit non mi porta gravida</p>
                                            </li>
                                            <li role="row">
                                                <p><code>&lt;li&gt; ... &lt;/li&gt;</code> Donec id elit non mi porta gravida</p>
                                            </li>
                                        </ul>
                                    </div>
                                </div>
                            </div>
                            <!-- // Widget --> 
                            
                        </div>
                        <!-- // Column -->
                        
                        <div class="span4">
                            <div class="widget widget-simple widget-collapsible">
                                <div class="widget-header header-small clickable" data-toggle="collapse" data-target="#demoB">
                                    <h4><i class="fontello-icon-window"></i> widge-row </h4>
                                    <div class="widget-tool"><span class="btn btn-glyph btn-link widget-toggle-btn fontello-icon-publish"></span></div>
                                </div>
                                <div id="demoB" class="widget-content collapse in">
                                    <div class="widget-body">
                                        <div class="widget-row">
                                            <p>Donec id elit non mi porta</p>
                                        </div>
                                        <div class="widget-row">
                                            <p>Donec id elit non mi porta</p>
                                        </div>
                                    </div>
                                    <div class="widget-footer">
                                        <div class="btn-toolbar"> <a class="btn btn-green" href="javascript:void(0);">View details &raquo;</a> </div>
                                    </div>
                                </div>
                            </div>
                            <!-- // Widget -->
                            
                            <div class="widget widget-simple">
                                <div class="widget-header">
                                    <h4><i class="fontello-icon-window"></i> widget-list <small>.list-dotted</small></h4>
                                    <div class="btn-toolbar pull-right"> <a class="btn btn-yellow" href="javascript:void(0);">New</a> </div>
                                </div>
                                <div class="widget-content">
                                    <div class="widget-body">
                                        <ul class="widget-list list-dotted">
                                            <li role="row">
                                                <p><code>&lt;li&gt; ... &lt;/li&gt;</code> Donec id elit non mi porta gravida</p>
                                            </li>
                                            <li role="row">
                                                <p><code>&lt;li&gt; ... &lt;/li&gt;</code> Donec id elit non mi porta gravida</p>
                                            </li>
                                            <li role="row">
                                                <p><code>&lt;li&gt; ... &lt;/li&gt;</code> Donec id elit non mi porta gravida</p>
                                            </li>
                                        </ul>
                                    </div>
                                </div>
                            </div>
                            <!-- // Widget --> 
                            
                        </div>
                        <!-- // Column -->
                        
                        <div class="span4">
                            <div class="widget widget-box widget-collapsible">
                                <div class="widget-header header-small clickable" data-toggle="collapse" data-target="#demoC">
                                    <h4><i class="fontello-icon-window"></i> widge-row </h4>
                                    <div class="widget-tool"><span class="btn btn-glyph btn-link widget-toggle-btn fontello-icon-publish"></span></div>
                                </div>
                                <div id="demoC" class="widget-content collapse in">
                                    <div class="widget-body">
                                        <div class="widget-row">
                                            <p>Donec id elit non mi porta</p>
                                        </div>
                                        <div class="widget-row">
                                            <p>Donec id elit non mi porta</p>
                                        </div>
                                    </div>
                                    <div class="widget-footer">
                                        <div class="btn-toolbar"> <a class="btn btn-green" href="javascript:void(0);">View details &raquo;</a> </div>
                                    </div>
                                </div>
                            </div>
                            <!-- // Widget -->
                            
                            <div class="widget widget-box">
                                <div class="widget-header">
                                    <h4><i class="fontello-icon-window"></i> widget-list</h4>
                                    <div class="btn-toolbar pull-right"> <a class="btn btn-yellow" href="javascript:void(0);">New</a> </div>
                                </div>
                                <div class="widget-content">
                                    <div class="widget-body">
                                        <ul class="widget-list">
                                            <li role="row">
                                                <p><code>&lt;li&gt; ... &lt;/li&gt;</code> Donec id elit non mi porta gravida</p>
                                            </li>
                                            <li role="row">
                                                <p><code>&lt;li&gt; ... &lt;/li&gt;</code> Donec id elit non mi porta gravida</p>
                                            </li>
                                            <li role="row">
                                                <p><code>&lt;li&gt; ... &lt;/li&gt;</code> Donec id elit non mi porta gravida</p>
                                            </li>
                                        </ul>
                                    </div>
                                </div>
                            </div>
                            <!-- // Widget --> 
                            
                        </div>
                        <!-- // Column --> 
                        
                    </div>
                    <!-- // Example row --> 
                    
                </section>
                <section>
                    <div class="page-header">
                        <h3>Widget Coloring</h3>
                    </div>
                    <div class="row-fluid">
                        <div class="span4">
                            <div class="widget widget-simple widget-collapsible bg-blue-light">
                                <div class="widget-header header-small clickable" data-toggle="collapse" data-target="#demoBlue">
                                    <h4><i class="fontello-icon-window"></i> Widget <small>widget row</small></h4>
                                    <div class="widget-tool"><span class="btn btn-glyph btn-link widget-toggle-btn fontello-icon-publish"></span></div>
                                </div>
                                <div id="demoBlue" class="widget-content collapse in">
                                    <div class="widget-body">
                                        <div class="widget-row">
                                            <p>Donec id elit non mi porta gravida at eget metus. Fusce dapibus, tellus ac cursus commodo.</p>
                                        </div>
                                        <div class="widget-row">
                                            <p>Donec id elit non mi porta gravida at eget metus. Fusce dapibus, tellus ac cursus commodo.</p>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <!-- // Widget --> 
                            
                        </div>
                        <!-- // Column -->
                        
                        <div class="span4">
                            <div class="widget widget-simple widget-collapsible bg-green-light">
                                <div class="widget-header header-small clickable" data-toggle="collapse" data-target="#demoGreen">
                                    <h4><i class="fontello-icon-window"></i> Widget <small>widget row</small></h4>
                                    <div class="widget-tool"><span class="btn btn-glyph btn-link widget-toggle-btn fontello-icon-publish"></span></div>
                                </div>
                                <div id="demoGreen" class="widget-content collapse in">
                                    <div class="widget-body">
                                        <div class="widget-row">
                                            <p>Donec id elit non mi porta gravida at eget metus. Fusce dapibus, tellus ac cursus commodo.</p>
                                        </div>
                                        <div class="widget-row">
                                            <p>Donec id elit non mi porta gravida at eget metus. Fusce dapibus, tellus ac cursus commodo.</p>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <!-- // Widget --> 
                            
                        </div>
                        <!-- // Column -->
                        
                        <div class="span4">
                            <div class="widget widget-simple widget-collapsible bg-yellow-light">
                                <div class="widget-header header-small clickable" data-toggle="collapse" data-target="#demoYellow">
                                    <h4><i class="fontello-icon-window"></i> Widget <small>widget row</small></h4>
                                    <div class="widget-tool"><span class="btn btn-glyph btn-link widget-toggle-btn fontello-icon-publish"></span></div>
                                </div>
                                <div id="demoYellow" class="widget-content collapse in">
                                    <div class="widget-body">
                                        <div class="widget-row">
                                            <p>Donec id elit non mi porta gravida at eget metus. Fusce dapibus, tellus ac cursus commodo.</p>
                                        </div>
                                        <div class="widget-row">
                                            <p>Donec id elit non mi porta gravida at eget metus. Fusce dapibus, tellus ac cursus commodo.</p>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <!-- // Widget --> 
                            
                        </div>
                        <!-- // Column --> 
                        
                    </div>
                    <!-- // Example row --> 
                    
                </section>
            </div>
            <!-- // page content --> 
            
        </div>
        <!-- // main-content --> 
        
    </div>
    <!-- // main-container  -->
    
    <footer id="footer-fix">
        <div id="footer-sidebar" class="footer-sidebar">
            <div class="navbar">
                <div class="btn-toolbar"> <a class="btn btn-glyph btn-link" href="javascript:void(0);"><i class="fontello-icon-up-open-1"></i></a> </div>
            </div>
        </div>
        <!-- // footer sidebar -->
        
        <div id="footer-content" class="footer-content">
            <div class="navbar navbar-inverse">
                <div class="navbar-inner">
                    <ul class="nav pull-left">
                        <li class="divider-vertical hidden-phone"></li>
                        <li><a id="btnToggleSidebar" class="btn-glyph fontello-icon-resize-full-2 tip hidden-phone" href="javascript:void(0);" title="show hide sidebar"></a></li>
                        <li class="divider-vertical hidden-phone"></li>
                        <li><a id="btnChangeSidebar" class="btn-glyph fontello-icon-login tip hidden-phone" href="javascript:void(0);" title="change sidebar position"></a></li>
                        <li class="divider-vertical"></li>
                        <li><a id="btnChangeSidebarColor" class="btn-glyph fontello-icon-palette tip" href="javascript:void(0);" title="change sidebar color"></a></li>
                        <li class="divider-vertical"></li>
                        <li><a class="btn-glyph fontello-icon-cw" href="javascript:void(0);"></a></li>
                        <li class="divider-vertical"></li>
                        <li><a class="fontello-icon-home-3" href="dashboard-one.html"></a></li>
                        <li class="divider-vertical"></li>
                    </ul>
                    <ul class="nav pull-right">
                        <li class="divider-vertical"></li>
                        <li><a class="btn-glyph fontello-icon-help-2 tip" href="javascript:void(0);" title="help to page"></a></li>
                        <li class="divider-vertical"></li>
                        <li><a class="btn-glyph fontello-icon-cog-4 tip" href="javascript:void(0);" title="settings app"></a></li>
                        <li class="divider-vertical"></li>
                        <li><a id="btnLogout" class="btn-glyph fontello-icon-logout-1 tip" href="javascript:void(0);" title="logout"></a></li>
                        <li class="divider-vertical"></li>
                        <li><a id="btnScrollup" class="scrollup btn-glyph fontello-icon-up-open-1" href="javascript:void(0);"><span class="hidden-phone">Scroll</span></a></li>
                    </ul>
                </div>
            </div>
        </div>
        <!-- // footer content --> 
        
    </footer>
    <!-- // footer-fix  --> 
    
</div>
<!-- // page-container  -->

<div class="modal-container"> <!-- You can put your modal definitions here but it is not required --> </div>
<div id="updateModal" class="modal hide fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
    <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
        <h4 id="myModalLabel"><i class="fontello-icon-popup"></i> Next :-)</h4>
    </div>
    <div class="modal-body text-center">
        <h3><i class="fontello-icon-user f30"></i> Sorry, this page comes up with next update <small>free after purchase</small></h3>
        <p>thanks</p>
    </div>
    <div class="modal-footer">
        <button class="btn btn-red" data-dismiss="modal">Close</button>
    </div>
</div>
<!-- // modal --> 

<!-- Le javascript --> 
<!-- Placed at the end of the document so the pages load faster --> 
<script src="assets/plugins/bootstrap-wysihtml5/lib/js/wysihtml5-0.3.0.min.js"></script> 
<script src="assets/js/lib/jquery.js"></script> 
<script src="assets/js/lib/jquery-ui.js"></script>
<script src="assets/js/lib/bootstrap.js"></script> 
<script src="assets/js/lib/jquery.cookie.js"></script> 

<!-- Plugins Bootstrap --> 
<script src="assets/plugins/bootstrap-datepicker/js/bootstrap-datepicker.js"></script> 
<script src="assets/plugins/bootstrap-timepicker/js/bootstrap-timepicker.js"></script> 
<script src="assets/plugins/bootstrap-colorpicker/js/bootstrap-colorpicker.js"></script> 
<script src="assets/plugins/bootstrap-daterangepicker/js/date.js"></script> 
<script src="assets/plugins/bootstrap-daterangepicker/js/bootstrap-daterangepicker.js"></script> 
<script src="assets/plugins/bootstrap-fileupload/js/bootstrap-fileupload.js"></script> 
<script src="assets/plugins/bootstrap-rowlink/js/bootstrap-rowlink.js"></script> 
<script src="assets/plugins/bootstrap-progressbar/js/bootstrap-progressbar.js"></script> 
<script src="assets/plugins/bootstrap-wysihtml5/src/bootstrap-wysihtml5.js"></script> 
<script src="assets/plugins/bootstrap-select/bootstrap-select.js"></script>
<script src="assets/plugins/bootstrap-bootbox/bootbox.min.js"></script> 
<script src="assets/plugins/bootstrap-modal/js/bootstrap-modalmanager.js"></script> 
<script src="assets/plugins/bootstrap-modal/js/bootstrap-modal.js"></script>
<script src="assets/plugins/bootstrap-wizard/js/bootstrap-wizard.js"></script> 
<script src="assets/plugins/bootstrap-toggle-buttons/js/bootstrap-toggle-buttons.js"></script>

<!-- Plugins Custom -->
<script src="assets/plugins/google-code-prettify/prettify.js"></script> 
<script src="assets/plugins/nicescroll/jquery.nicescroll.min.js"></script> 
<script src="assets/plugins/qtip2/dist/jquery.qtip.min.js"></script> 
<script src="assets/plugins/list/js/list.min.js"></script> 
<script src="assets/plugins/list/plugins/list.paging.min.js"></script> 
<script src="assets/plugins/fullcalendar/fullcalendar.js"></script> 
<script src="assets/plugins/xbreadcrumbs/xbreadcrumbs.js"></script> 

<!-- Plugins Forms --> 
<script src="assets/plugins/uniform/jquery.uniform.js"></script> 
<script src="assets/plugins/select2/select2.min.js"></script> 
<script src="assets/plugins/counter/jquery.counter.js"></script> 
<script src="assets/plugins/elastic/jquery.elastic.js"></script> 
<script src="assets/plugins/inputmask/jquery.inputmask.js"></script> 
<script src="assets/plugins/inputmask/jquery.inputmask.extensions.js"></script> 
<script src="assets/plugins/validate/js/jquery.validate.min.js"></script> 
<script src="assets/plugins/xbreadcrumbs/xbreadcrumbs.js"></script> 

<!-- Charts --> 
<script src="assets/plugins/sparkline/jquery.sparkline.js"></script> 
<script src="assets/plugins/flot/jquery.flot.js"></script> 
<script src="assets/plugins/flot/jquery.flot.categories.js"></script> 
<script src="assets/plugins/flot/jquery.flot.grow.js"></script> 
<script src="assets/plugins/flot/jquery.flot.orderBars.js"></script> 
<script src="assets/plugins/flot/jquery.flot.pie.js"></script> 
<script src="assets/plugins/flot/jquery.flot.resize.js"></script> 
<script src="assets/plugins/flot/jquery.flot.selection.js"></script> 
<script src="assets/plugins/flot/jquery.flot.stack.js"></script> 
<script src="assets/plugins/flot/jquery.flot.stackpercent.js"></script> 
<script src="assets/plugins/flot/jquery.flot.time.js"></script> 

<!-- Plugins Tables --> 
<script src="assets/plugins/datatables/media/js/jquery.dataTables.js"></script> 
<script src="assets/plugins/datatables/plugin/jquery.dataTables.plugins.js"></script> 
<script src="assets/plugins/datatables/plugin/jquery.dataTables.columnFilter.js"></script> 

<!-- main js -->
<script src="assets/js/application.js"></script>  

<!-- Only This Demo Page --> 
</body>
</html>
